/**
 * 登陆页面
 */

// export default function Login() {
//   return <div>登录页</div>;
// }

import { FC, useEffect } from 'react';
import { connect, ModalState, Loading, Dispatch } from 'umi';
interface Iprops {
  name: string;
  dispatch: Dispatch;
}

//FC代表类型是函数组件,FC<Iprops>表示这个函数组件的参数类型是Iprops
const Login: FC<Iprops> = (props) => {
  const { name, dispatch } = props;
  useEffect(() => {
    dispatch({
      type: 'login/login',
      payload: {
        userName: 'bxj',
        password: 'abcdefg',
      },
    });
  }, []);

  console.log('name', name);
  return <div>登录页</div>;
};
// connect第一个括号里的是一个函数。函数参数是{loading,所有的model}。默认返回一个对象到props中，对象中是model中的state
// connect也会同时添加dispatch到props中。dispatch可以触发一个action到model中
// export default connect(()=>({}))(Login)
export default connect(
  ({ loading, login }: { loading: Loading; login: ModalState }) => ({
    name: login.name,
  }),
)(Login);
